<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>网址管理工具</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" href="css/list.css" />
    <style>
        table{
            width:1050px;
            table-layout:fixed;/* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */
        }
        td{
            width:100%;
            word-break:keep-all;/* 不换行 */
            white-space:nowrap;/* 不换行 */
            overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
            text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
        }
    </style>
</head>
<body>
    <div class="main">
        <div th:replace="header :: header"></div>
        <div class="below " style="display: block">
            <div th:replace="navigator :: navigator"></div>
            <div class="b_right ">
                <div class="search-urls">
                    <form action="/searchUrls" method="post">
                        网址索引: <input name="u_title" style="width: 120px"/>&nbsp;
                        主题索引: <input name="type" style="width: 120px"/>
                        日期: <input name="date" style="width: 120px" type="date"/>
                        &nbsp;&nbsp;<button type="submit">搜索</button>
                    </form>
                </div>
                <div class="bookList">
                    <table align='center' border='1' cellspacing='0'>
                        <tr>
                            <td style="width: 40px;text-align: center">ID</td>
                            <td style="width: 400px;text-align: center">网址名</td>
                            <td style="width: 150px;text-align: center" >网址 链接</td>
                            <td style="width: 250px;text-align: center">日期</td>
                            <td style="width: 100px;text-align: center">详情</td>
                            <td style="width: 75px;text-align: center">是否回收</td>
                        </tr>
                        <tr th:each="c:${page.list}">
                            <td style="width: 40px;text-align: center" th:text="${c.u_id}"></td>
                            <td style="width: 400px;text-align: left" th:text="${c.u_title}"></td>
                            <td style="width: 150px;text-align: center" ><a target="_blank" th:href="${c.url}"> 点击&nbsp;&nbsp;进入 </a></td>
                            <td  style="width: 250px;text-align: center" th:text="${c.date}"></td>
                            <td style="width: 100px;text-align: center"><a th:href="@{/editUrls(u_id=${c.u_id})}">详情</a></td>
                            <td style="width: 75px;text-align: center"><a th:href="@{/deleteUrls(u_id=${c.u_id})}">回收</a></td>
                        </tr>
                    </table>
                    <br/>
                    <div>
                        <a th:href="@{/index(start=0)}">[首 页]</a>
                        <a th:href="@{/index(start=${page.pageNum-1})}">[上一页]</a>
                        <a th:href="@{/index(start=${page.pageNum+1})}">[下一页]</a>
                        <a th:href="@{/index(start=${page.pages})}">[末 页]</a>
                    </div>
                </div>
            </div>
        </div>
        <div th:replace="footer :: footer" ></div>
    </div>
</body>
</html>